export default function Table(props)
{
    const OnDel = (id) =>
    {
        // console.log(id);
        props.OnDel(id);
    }

    return (
        <>
            <table>
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>Name</th>
                        <th>Operate</th>
                    </tr>
                </thead>
                <tbody>
                    {props.list.map(item =>
                    {
                        return (
                            <tr key={item.id}>
                                <td>{ item.id }</td>
                                <td>{ item.name }</td>
                                <td>
                                    <button>编辑</button>
                                    <button onClick={() => OnDel(item.id)}>删除</button>
                                </td>
                            </tr>
                        )
                    })}
                </tbody>
            </table>
        </>
    )
}